<template>
	<el-dialog title="审核任务" :visible.sync="value" width="560px" :before-close="beforeClose">
		<el-form ref="form" :model="form" label-width="80px">
			<el-form-item label="任务类型">
				<el-row :gutter="20">
					<el-col :span="8" v-for="item in taskTypeList" :key="item.value">
						{{item.label}}
					</el-col>
				</el-row>
			</el-form-item>
			<el-form-item label="完成状态" prop="isPass">
				{{ checkStatusName }}
			</el-form-item>
			<el-form-item prop="isPass" label-width="10px">
				<el-input type="textarea" rows="5" placeholder="请输入您的审核意见"></el-input>
			</el-form-item>
		</el-form>
		<div class="btn-group">
			<el-button class="btn refuse" @click="submit(false)">不通过</el-button>
			<el-button class="btn pass" @click="submit(true)">通过 <i class="el-icon-arrow-right"></i></el-button>
		</div>
	</el-dialog>
</template>
<script>
	import {
		getPreCheckTask,
		reviewCheckTask
	} from '@/api/enterprise'
	export default {
		props: {
			value: {
				type: Boolean,
				default: false
			},
			row: {
				type: Object,
				default: () => null
			}
		},
		watch: {
			row(row) {
				if (row) {
					this.form.reviewId = row.id
					this.getPreCheckTask()
				}
			}
		},
		data() {
			return {
				taskList: [],
				checkStatusName: '',
				form: {
					reviewId: '',
					isPass: true
				},
				taskTypeList: [],
			}
		},
		computed: {
			checkTaskTypeDict() {
				const dict = this.$store.getters.dict
				const list = []
				for (let value in dict.checkTaskType) {
					list.push({
						label: dict.checkTaskType[value],
						value
					})
				}
				return list
			},
			checkStatusDict() {
				const dict = this.$store.getters.dict
				const list = []
				for (let value in dict.checkStatus) {
					list.push({
						label: dict.checkStatus[value],
						value
					})
				}
				return list
			},
		},
		methods: {
			getPreCheckTask() {
				getPreCheckTask({
					reviewId: this.form.reviewId,
				}).then((res) => {
					// this.taskList = []
					// this.checkTaskTypeDict.forEach(dict => {
					// 	res.data.forEach(item => {
					// 		if (item === dict.value) {
					// 			this.taskList.push(dict)
					// 		}
					// 	})
					// });
					const dict1 = this.$store.getters.dict
					res.data.forEach(item => {
						this.taskTypeList.push({
							label: dict1.checkTaskType[item.checkTaskType],
							value: item.id,
						})
					})

					if (res.data.length > 0) {
						this.checkStatusName = this.checkStatusDict.find(item => item.value == res.data[0]
							.checkStatus).label
					}
				})
			},
			submit(isPass) {
				if (!isPass && !this.noPassReason) {
					this.$message.error('请输入不通过原因')
					return
				}
				reviewCheckTask({
					reviewId: this.form.reviewId,
					isPass,
					noPassReason: this.noPassReason
				}).then((res) => {
					this.$message.success('操作成功')
					this.beforeClose()
				})
			},
			beforeClose() {
				this.$emit('input', false)
			}
		}
	}
</script>
<style lang="scss" scoped>
	::v-deep .el-dialog .el-dialog__body {
		padding: 30px 10px 30px 0;
	}

	.el-form {
		padding: 0 10px;
	}

	.check-list {
		padding: 0 40px;
	}

	::v-deep .el-textarea__inner {
		background: rgba(0, 8, 34, 0.05);
		border: 0;
	}

	.btn-group {
		margin-top: 30px;
		text-align: center;

		.btn {
			width: 104px;
			height: 40px;
			color: #ffffff;
			border: none;

			&.refuse {
				background: #000822;
				border-radius: 4px 0 0 4px;
			}

			&.pass {
				background: #1c4088;
				margin: 0;
				border-radius: 0 4px 4px 0;
			}
		}
	}
</style>